import React from 'react';
import ReactDOM from 'react-dom';
import { exportExcel } from 'xlsx-oc'
import '../../static/tero/table.less';
import Pop from './popup.jsx';
import $ from 'jquery'
import '../../static/app.css'
import u from '../../common.js'
import { LocaleProvider, Pagination } from 'antd';
import zh_CN from 'antd/lib/locale-provider/zh_CN';
import { Link } from 'react-router-dom'
import { message } from 'antd';
import '../../static/icon/iconfont.css'
let query = document.querySelector.bind(document)
let queryAll = document.querySelectorAll.bind(document)
const type = u.getStore(type)


let load = true //节流
let judge = 0 //研判
// document.onselectstart = function () {
//   return false;
// };

class Table extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      index: 1,
      display: 'none',
      list: [{ index: 1, flag: false, num: false, flag2: false, num2: false, gray: false }, {
        index: 2,
        flag: false,
        num: false,
        flag2: false,
        num2: false,
        gray: false
      }, { index: 3, flag: false, num: false, flag2: false, num2: false, gray: false }, {
        index: 4,
        flag: false,
        num: false,
        flag2: false,
        num2: false,
        gray: false
      }, { index: 5, flag: false, num: false, flag2: false, num2: false, gray: false }, {
        index: 6,
        flag: false,
        num: false,
        flag2: false,
        num2: false,
        gray: false
      }, { index: 7, flag: false, num: false, flag2: false, num2: false, gray: false }, {
        index: 8,
        flag: false,
        num: false,
        flag2: false,
        num2: false,
        gray: false
      }],
      flag: false,
      number: null,       //控制打开哪一个表格每行的弹框 每条的索引
      down: true,            //
      numflag: true,        //控制表格研判及箭头的弹出框
      operation: [],       //表格上方ul
      sentenceFlag: false, //表格上方研判按钮的弹出框flag
      current: 1,  //当前页数
      size: 10,    //每页显示条数
      total: 0,   //总条数
      pagesize: 0, //
      load: true,//节流
      del: '', //删除的参数
      checked: 0, //选中的个数
      startTime: u.getDate(0, false),
      endTime: u.getDate(0, true),
      more: true, //是否批量
      checkedArr: [],//选中的索引数组
      checkedAll: [],//选中的数组
      sortAdd: [],  //发布时间正序逆序
      sortPost: [],//监测时间正序逆序
      type: 0,
      lange: '',
      sortFlag: true,
      sortAddFlag: true,
      read: 0 ,// 全部未阅+已阅
      
    }
  }

  componentWillMount() {
    this.tableData(1, this.state.startTime, this.state.endTime)
  }
//查看

  handle(id, content, keyword, infoId) {
   this.setState((prevState,props)=>({
    more:false
   }),()=>{
    this.read()
    const w = window.open('about:blank');
    localStorage.setItem('content', content);
    if (this.props.warn) {
      w.location.href = u.testurl + '/journa?' + infoId
      return;
    }
    w.location.href = u.testurl + '/journa?' + id + '?' + keyword
   })
   
 
  }

  tableData(page, startTime, endTime) {  //接口的调用数据的渲染
    let type = this.state.type || this.props.type
    let that = this
    let fail = () => {
      load = true
      this.tableData(page, this.state.startTime, this.state.endTime)
      //调用失败在调一次
    }
    this.setState((prevState, props) => ({
      startTime: startTime,
      endTime: endTime
    }))
    setTimeout(() => {
      let data = {
        "startTime": that.state.startTime,
        "endTime": that.state.endTime,
        "page": page || 1,
        "size": this.state.size
      };
      switch (this.state.read) { //已阅
        case 1:
          data.isRead = 1
          data.read = JSON.parse(localStorage.getItem('readIndex')) || []
          break;
        case 2:
          data.isRead = 2
          data.read = JSON.parse(localStorage.getItem('readIndex')) || []
          break;
      }
      if (this.props.warn) {
        u.selectYb({ page: page || 1, size: this.state.size }, data => {
          this.dataList(page, data) //样本库
        }, fail)
        setTimeout(() => {
          load = true
        }, 100)
      } else if (this.props.simple) { //预警
        switch (this.state.lange) {//语言
          case 1:
            data.language = '0'
            break;
          case 2:
            data.language = "2"
            break;
          case 3:
            data.language = "1"
            break;
          case 4:
            data.language = "3"
            break;
          default:
            break;
        }
        u.simplee(data, data => {
          this.dataList(page, data)
        }, fail)
        setTimeout(() => {
          load = true
        }, 100)
      } else {
        (type || type == 0) && !this.props.dataStudy ? data.webSiteType = type : ''
        this.props.keywords ? data.keyWord = this.props.keywords : ''
        this.props.dataStudy ? data.judgeType = "all" : ''
        switch (judge) {
          case 1:
            data.judgeType = '0'
            break;
          case 2:
            data.judgeType = "1"
            break;
          case 3:
            data.judgeType = "2"
            break;
          case 4:
            data.judgeType = "all"
            break;
          default:
            break;
        }
        judge = 0;
        switch (this.state.lange) {//语言
          case 1:
            data.language = '0'
            break;
          case 2:
            data.language = "2"
            break;
          case 3:
            data.language = "1"
            break;
          case 4:
            data.language = "3"
            break;
          default:
            break;
        }
        if (this.props.dataStudy || this.props.infoList) { //研判 || 信息列表
          u.queryListyangpang(data, data => {
            this.dataList(page, data)
          }, fail)
        } else {
          u.queryList(data, data => {

            this.dataList(page, data)
          }, fail)
        }
      }
    }, 10)
  }

  toogleClass() { //切换table栏
    var that = this;
    $(() => {
      $(window).resize(() => {
        $('.down_td').css('width', $('.table').outerWidth() + 'px')
      })
      $('.app-top>ul>li').click(function () {
        if ($(this).text().includes("：") || !load) return;
        that.setState((prevState, props) => ({
          current: 1
        }))
        load = false;
        setTimeout(() => {
          load = true
        }, 1000)
        switch ($(this).text()) {
          case '今日':
            that.tableData(1, u.getDate(0, false), u.getDate(0, true));
            break;
          case '昨日':
            that.tableData(1, u.getDate(1, false), u.getDate(1, true));
            break;
          case '近三日':
            that.tableData(1, u.getDate(3, false), u.getDate(0, true));
            break;
          case '近七日':
            that.tableData(1, u.getDate(7, false), u.getDate(0, true));
            break;
          case '案件':
            that.tableData(1, that.state.startTime, that.state.endTime);
            judge = 1
            break;
          case '舆情':
            that.tableData(1, that.state.startTime, that.state.endTime);
            judge = 2
            break;
          case '情报':
            that.tableData(1, that.state.startTime, that.state.endTime);
            judge = 3
            break;
          case '全部':
            switch ($(this).prev().text()) {
              case '类型：':
                that.tableData(1, that.state.startTime, that.state.endTime);
                judge = 4
                break;
              case '语言：':
                that.setState((prevState, props) => ({
                  lange: ''
                }))
                that.tableData(1, that.state.startTime, that.state.endTime);
                break;
              case '浏览倾向：':
                that.tableData(1, that.state.startTime, that.state.endTime);
                that.setState((prevState, props) => ({
                  read: 0
                }))
                break;
              default:
                load = true;
                break;
            }
            break;
          case '其他':
            that.setState((prevState, props) => ({
              lange: 4
            }))
            that.tableData(1, that.state.startTime, that.state.endTime);
            break;
          case '藏文':
            that.setState((prevState, props) => ({
              lange: 2
            }))
            that.tableData(1, that.state.startTime, that.state.endTime);
            break;
          case '中文':
            that.setState((prevState, props) => ({
              lange: 1
            }))
            that.tableData(1, that.state.startTime, that.state.endTime);
            break;
          case '英语':
            that.setState((prevState, props) => ({
              lange: 3
            }))
            that.tableData(1, that.state.startTime, that.state.endTime);
            break;
          case '已阅':
            that.setState((prevState, props) => ({
              read: 1,
            }), () => {
              that.tableData(1, that.state.startTime, that.state.endTime);
            })
            break;
          case '未阅':
            that.tableData(1, that.state.startTime, that.state.endTime);
            that.setState((prevState, props) => ({
              read: 2
            }))
            break;
          default:
            load = true;
            break;

        }
        if ($(this).text() == '自定义') {
          $(this).siblings().css({ 'border': 'none', 'color': '#30383e' })
          load = true;
          return
        }
        ;
        $(this).css({ 'border': '1px solid #5286ff', 'color': '#5286ff' }).siblings().css({
          'border': 'none',
          'color': '#30383e'
        }) //头部样式的切换
      })
      // $('.app-conter-top>ul>li:nth-of-type(1)').removeClass('active').addClass('active_app')


      // $(".app-conter-top>ul>li").click(function () {
      //   $(this).addClass('active_app').siblings().removeClass('active_app') //表格上方ul的切换

      // })
    })
  }

  componentDidMount() {
    this.toogleClass()
  }

  dataList(page, data) { //数据处理
    this.checkedReset()
    if (this.props.simple) {
      data = u.isArray(data.data) ? data : data.data
    }
    load = true
    u.setStore('error', { flag: true })
    let read = JSON.parse(localStorage.getItem('readIndex')) || [];
    let that = this;
    let arr = data.data.slice(0)
    let brr = []
    let crr = []
    let drr = []
    let frr = []
    data.data.forEach(item => {
      brr.push(this.props.warn ? item.add_time : item.addTime)
      crr.push(this.props.warn ? item.post_time : item.poTime)
      brr.sort((a, b) => { //排序处理
        return b - a
      })
      crr.sort((a, b) => {
        return b - a
      })
    })
    brr.forEach((item) => {
      data.data.some(itam => {
        return (item == (that.props.warn ? itam.add_time : itam.addTime) && drr.indexOf(itam) == -1) && drr.push(itam)
      })
    })
    crr.forEach((item) => {
      data.data.some(itam => {
        return (item == (that.props.warn ? itam.post_time : itam.poTime) && frr.indexOf(itam) == -1) && frr.push(itam)
      })
    })

    let numberRead = 0; //未阅
    arr.map((item, index) => {
      item.idIndex = (page ? (page - 1) : 0) * that.state.size + index + 1
      item.flag = false
      item.flag2 = false
      item.num = false
      item.num2 = false
      item.gray = false
      item.addTime = that.props.warn ? item.add_time : u.unixTime(item.addTime)
      item.poTime = that.props.warn ? item.post_time : u.unixTime(item.poTime)
      switch (this.state.read) {
        case 0:
          read.indexOf(item.id) !== -1 ? item.read = true : item.read = false
          break;
        case 1:
          item.read = true
          break;
      }
    })
    this.setState((prevState, props) => ({
      list: arr,
      total: Math.ceil(data.total),
      pagesize: Math.ceil(data.total / this.state.size),
      sortAdd: drr,
      sortPost: frr,
    }))


  }

  check(arr) {  //选中的个数极其索引
    let brr = [];
    let crr = arr.filter((item, index) => {
      return item.flag ? brr.push(index) : ''
    })
    this.setState((prevState, props) => ({
      list: arr,
      checked: crr.length,
      checkedArr: brr,
      checkedAll: crr
    }))
  }

  toggleAll() {   //全选的切换
    this.setState((prevState, props) => ({
      flag: !this.state.flag
    }))
    let arr = this.state.list.slice(0)
    arr.forEach((item, index) => {
      arr[index].flag = !this.state.flag
    })
    this.check(arr);
  }

  toogle(index) { //单个的切换
    let arr = this.state.list.slice(0);
    arr[index].flag = !arr[index].flag;
    arr.some((item) => {
      return !item.flag
    }) ? this.setState((prevState, props) => ({
      flag: false
    })) : this.setState((prevState, props) => ({
      flag: true
    }))
    this.check(arr);   //选中的数组
  }

  pop(index) { //控制打开pop遮罩弹框的类型
    this.setState((prevState, props) => ({
      index: index,
      display: 'block',
    }))

  }

  research(indexx) {  //研判
    let arr = []
    let data = {}
    if (this.state.more) {   //批量
      this.state.checkedAll.forEach((item) => {
        data = {}
        data.index = item.index;
        data.type = item.type;
        data.id = item.id;
        data.judgeType = indexx + '';
        arr.push(data)
      })
    } else {    //单个
      let number = this.state.number;
      data.index = this.state.list[number].index;
      data.type = this.state.list[number].type;
      data.id = this.state.list[number].id;
      data.judgeType = indexx + '';
      arr.push(data)
    }
    u.yangpang({ content: arr }, data => {
      if (indexx == 0) {
        message.success('研判案件', [1], )
      } else if (indexx == 1) {
        message.success('研判舆情', [1], )
      } else {
        message.success('研判情报', [1], )
      }
      this.checkedReset()
      sessionStorage.setItem('basickeyword', '6')
      setTimeout(() => {
        window.location.reload()
        window.location.href = u.testurl + '/dataStudy'
      }, 200)

    })

  }

  deleted() {     //删除
    let read = JSON.parse(localStorage.getItem('readIndex')) || []
    if (this.state.more) {
      this.setState((prevState, props) => ({
        more: false
      }))  //批量删除
      let brr = this.state.list.slice(0);
      let del = ''
      brr.filter((item, index) => {
        return item.flag
      }).forEach((item, index) => {
        del += item.index + '|' + item.type + '|' + item.id + ';'
        read.length > 0 && read.indexOf(item.id) !== -1 ? read.splice(read.indexOf(item.id), 1) : ''

      })
      for (let i = brr.length - 1; i >= 0; i--) {
        this.state.list[i].flag ? brr.splice(i, 1) : ''
      }
      if (this.props.warn) { // 样本库的删除
        let id = ''
        this.state.checkedAll.forEach((item) => {
          id += item.id + ','
        })
        id = id.substr(0, id.length - 1)
        u.deleteYb({ ids: id }, data => {
          message.success('删除成功', [1], )
          this.checkedReset()
          this.dataReset()
        })
      } else {

        del = del.substr(0, del.length - 1)
        u.del({ content: del }, data => {
          message.success('删除成功', [1], )
          this.checkedReset()
          this.dataReset()
        })
      }
    } else {   //单个删除
      let arr = this.state.list.slice(0);
      arr.splice(this.state.number, 1)
      if (this.props.warn) {  // 样本库的删除
        u.deleteYb({ ids: this.state.list[this.state.number].id + '' }, data => {
          message.success('删除成功', [1], )
          this.checkedReset()
          this.dataReset()
        })
      } else {
        let readIndex = read.indexOf(this.state.list[this.state.number].id)
        read.length > 0 && readIndex !== -1 ? read.splice(readIndex, 1) : ''
        u.del({ content: this.state.del }, data => {
          message.success('删除成功', [1], )
          this.checkedReset()
          this.dataReset()
        })
      }
    }
    localStorage.setItem('readIndex', JSON.stringify(read))
  }

  read() {
    let brr = JSON.parse(localStorage.getItem('readIndex')) || [];
    let list = this.state.list.slice(0);
    if (this.state.more) {  //批量已阅
      let arr = this.state.checkedArr.slice(0)
      let length = arr.length;
      for (var i = 0; i < length; i++) {
        list[arr[i]].read = true;
      }
      this.state.checkedAll.forEach((item) => {
        brr.push(item.id)
      })
      this.checkedReset()
    } else {   //单个已阅
      list[this.state.number].read = true;
      brr.push(this.state.list[this.state.number].id)
    }
    this.setState((prevState, props) => ({
      list: list
    }),()=>{
      localStorage.setItem('readIndex', JSON.stringify(Array.from(new Set(brr))))
    u.yujing.flag = !u.yujing.flag
    })
    
  }

  checkedReset() {   //选中重置
    let arr = this.state.list.slice(0);
    arr.forEach((item, index) => {
      item.flag = false
    })
    this.setState((prevState, props) => ({
      list: arr,   // 列表重置
      checked: 0,    //个数重置
      flag: false, //全选的重置
    }))
  }

  addData(data) {  //加入样本的参数
    return data && {
      "info_id": data.id,
      "positiveOrNegative": data.positiveOrNegative,
      "title": data.title,
      "content": data.content,
      "webSite": data.webSite,
      "domain": data.domain,
      "url": data.url,
      "post_time": data.poTime,
      "add_time": data.addTime
    }
  }

  addLibary() {
    if (this.state.more) { //批量加入样本库
      let arr = [];
      let data = {}
      this.state.list.forEach((item, index) => {
        if (item.flag) {
          arr.push(this.addData(item))
        }
      })
      u.addSamplelibrary(arr, data => {
        message.success('加入成功', [1], )
        sessionStorage.setItem('basickeyword', '5')
        sessionStorage.setItem('basickeysub', 'sub1')
        window.location.reload()
        window.location.href = u.testurl + '/warn'
      })
      this.checkedReset()

    } else { //单个加入样本库
      let arr = []
      arr.push(this.addData(this.state.list[this.state.number]))
      u.addSamplelibrary(arr, data => {
        message.success('加入成功', [1], )
        sessionStorage.setItem('basickeyword', '5')
        sessionStorage.setItem('basickeysub', 'sub1')
        window.location.reload()
        window.location.href = u.testurl + '/warn'
      })
    }
  }

  popProp(val, index) { // 用来关闭遮罩弹框
    this.setState((prevState, props) => ({
      display: val
    }))
    switch (index) {
      case 0:
        this.addLibary()
        break;
      case 1:
        this.deleted()
        break;
      case 2:
        this.research(0)
        break;
      case 3:
        this.checkedReset()
        break;
      case 4:

        break;
      case 5:
        this.addLibary()
        break;
      case 6:

        break;
      case 7:
        this.exportMore()
        break;
      case 8:
        this.read()
        break;
      case 9:
        this.research(1)
        break;
      case 10:
        this.research(2)
        break;
    }
  }
  exportMore() {
    let list = this.state.checkedAll
    let str = []
    var reg = new RegExp("<[^<]*>", "gi");
    list.forEach((el, index) => {
      let arr = {
        key: index, title: el.title.replace(reg, ""), source: el.webSite, content: el.content.replace(reg, ""), timeOne: el.poTime, timeTwo: el.addTime
      }
      str.push(arr)
    })
    this.exportDefaultExcel(str)
  }
  exportDefaultExcel = (str) => {
    var _headers = [{ k: 'title', v: '标题' }, { k: 'source', v: '来源' }, { k: 'content', v: '内容' }, { k: 'timeOne', v: '发布时间' }, { k: 'timeTwo', v: '监测时间' }]
    exportExcel(_headers, str);
  }

  leave(index) { //控制鼠标离开关闭弹出框
    if (index == -1) {
      this.setState({
        sentenceFlag: false
      })
    } else {
      let arr = this.state.list.slice(0);
      arr[index].num = false;
      arr[index].num2 = false;
      this.setState((prevState, props) => ({
        list: arr
      }))
    }

  }

  select() {
    return this.state.list.some((item, index) => {
      return item.flag
    })
  }   //有无选中
  sort(arr) { //排序
    arr.forEach((item, index) => {
      item.idIndex = (this.state.current ? (this.state.current - 1) : 0) * this.state.size + index + 1
    })
    this.setState((prevState, props) => ({
      list: arr
    }))
  }

  itemRender = (current, pagesize) => {
    this.setState((prevState, props) => ({
      current: current,
      size: pagesize
    }))
    setTimeout(() => {
      this.tableData(current, this.state.startTime, this.state.endTime)
    }, 10)

  }
  dataReset() {
    setTimeout(()=>{
      this.tableData(this.state.current, this.state.startTime, this.state.endTime)
    },1000)
  }

  down(e, index, num) { //控制table+-的内容显示及隐藏
    let arr = this.state.list.slice(0)
    $('.down_td').css('width', $('.table').outerWidth() + 'px')
    arr[index].flag2 = !arr[index].flag2
    this.setState((prevState, props) => ({
      list: arr
    }))
  }
//点击标题
  onGoDetail(id, content, keyword, infoId) {
    this.setState((prevState, props) => ({
      more: false,
      number: id,
    }),()=>{
      this.read()
      const w = window.open('about:blank');
      localStorage.setItem('content', content);
      if (this.props.warn) {
        w.location.href = u.testurl + '/journa?' + infoId
        return;
      }
      w.location.href = u.testurl + '/journa?' + id + '?' + keyword
    })
    
  }
  render() {
    return (
      <div className='table'>
        <Pop index={this.state.index} display={this.state.display} colse={this.popProp.bind(this)} />
        <div className='app-conter' style={{ padding: '0px' }}>
          <p>共搜索到 <span>{this.state.total}</span> 条数据</p>
          <div className={this.state.checked ? 'app-conter-div app-conter-div-active' : 'app-conter-div'} >
            <img src={require("../../static/image/blueTips.png")} />
            <span> 已选择 {this.state.checked} 项 </span>
            <span className='app-conter-div-lastspan'
              onClick={() => {
                this.select() ? this.pop(3) : this.pop(4)
              }}
            >清空</span>
          </div>
          <div className='app-conter-box'>
            <div className='app-conter-top'>
              <ul onClick={() => {
                this.setState((prevState, props) => ({
                  more: true
                }))
              }}>
                {
                  this.props.operation.map((item, index) => {
                    return (item == '研判' ? <li key={index} style={{ position: 'relative' }} onMouseLeave={() => {
                      this.leave(-1)
                    }} onClick={() => {
                      this.select() ? this.setState((prevState, props) => ({
                        sentenceFlag: !this.state.sentenceFlag,
                      })) : this.pop(4)
                    }}>{item}
                      <div onMouseLeave={() => {
                        this.leave(-1)
                      }} className={this.state.sentenceFlag ? 'research_son_two active_table_two' : 'research_son_two'}>
                        <p onClick={() => {
                          this.pop(2)
                        }}>案件</p><p className='active_poptable' onClick={() => {
                          this.pop(9)

                        }}
                        >舆情</p>
                        <p onClick={() => {
                          this.pop(10)

                        }}
                        >情报</p></div>
                    </li> : <li key={index}
                      onClick={() => {
                        if (this.select()) {
                          switch (item) {
                            case '导出':
                              this.pop(7)
                              break;
                            case '删除':
                              this.pop(1)
                              break;
                            case '加入样本库':
                              this.pop(5)
                              break;
                            case '标记已阅':
                              this.pop(8)
                              break;
                            default:
                              break;
                          }
                        } else {
                          this.pop(4)
                        }

                      }}
                    >{item}</li>)
                  })
                }
              </ul>

            </div>
            <div>

            </div>
          </div>

          <table className='table_list' style={{ marginBottom: '30px' }} id='tablle_export'>
            <tbody>
              <tr className='activee'>
                <td><span className={this.state.flag ? 'active' : ''} onClick={() => {
                  this.toggleAll()
                }}></span></td>
                <td>ID</td>
                <td>标题</td>
                <td>来源</td>
                <td><span className='left'
                  onClick={() => {
                    this.sort(this.state.sortFlag ? this.state.sortPost.slice(0).reverse() : this.state.sortPost.slice(0))
                    this.setState((prevState, props) => ({
                      sortFlag: !this.state.sortFlag
                    }))
                  }}
                >发布时间</span>
                  <div className='tip'><span className='top'><img src={require('../../static/image/table_up.png')}
                    alt="" /></span><span className='bottom'><img
                      src={require('../../static/image/table_down.png')} alt=""
                    /></span></div>
                </td>
                <td><span className='left'
                  onClick={() => {
                    this.sort(this.state.sortAddFlag ? this.state.sortAdd.slice(0).reverse() : this.state.sortAdd.slice(0))
                    this.setState((prevState, props) => ({
                      sortAddFlag: !this.state.sortAddFlag
                    }))
                  }}
                >监测时间</span>
                  <div className='tip'><span className='top'><img
                    src={require('../../static/image/table_up.png')} /></span><span className='bottom'><img
                      src={require('../../static/image/table_down.png')}
                    /></span></div>
                </td>
                {this.props.dataStudy && <td>类型</td> //信息巡查
                }
                <td>操作</td>
              </tr>
              {

                (this.state.total == 0 && <tr>
                  <td colSpan='8' style={{ textAlign: 'center' }}>暂无任何数据</td>
                </tr>) || this.state.list && this.state.list.map((item, index) => {
                  return (
                    <tr key={index} className={item.flag2 ? 'bottom_td bxx' : 'bxx'} >

                      {/*字体颜色变灰的样式style={{ color: item.read ? '#ccc' : "#30383e" }}
                         <td ><span className={item.flag ? 'active' : ''} onClick={() => {
                                                this.toogle(index)
                                            }}></span><span
                                                onClick={() => {
                                                    this.down(index)
                                                }}
                                            >{item.flag2 ? '-' : "+"}</span><div className={item.flag2 ? 'down_td last_tr down_pop' : 'down_td last_tr'}>
                                                    {this.props.baten ? 'མི་དམངས་ཉིན་རེའི་ཚགས་པར་གྱིས་དཔྱད་གཏམ་པའི་རྩོམ་ཡིག་འགོ་བརྗོད་དུ་ཕྱོགས་མང་རིང་ལུགས་རྒྱུན་འཁྱོངས་བྱས་ནས་གོ་ལའི་བཅོས་སྐྱོང་འཐུས་སྒོ་ཚང་དུ་གཏོང་དགོས་ཞེས་པ་སྟེ་ཀྲུའུ་ཞི་ཞི་ཅིན་ཕིང་གི་འབོ་གསེར་རྒྱལ་ཁབ་བཟོ་ཚོང་གླེང་སྟེགས་ཀྱི་གལ་ཆེའི་གསུང་བཤད་ཐེངས་ལྔ་པ་ཞེས་པ་སྤེལ་བ།ཀྲུང་དབྱང་རླུང་འཕྲིན་ལས་ཁུངས་ནས་གནས་ཚུལ་སྤེལ་གསལ། སྤྱི་ཟླ་༧པའི་ཚེས་༣༡ཉིན། མི་དམངས་ཉིན་རེའི་ཚགས་པར་གྱིས་དཔྱད་གཏམ་པའི་རྩོམ' +
                                                        '་ཡིག་འགོ་བམི་དམངས་ཉིན་རེའི་ཚགས་པར་གྱིས་དཔྱད་གཏམ་པའི་རྩོམ་ཡིག་འགོ་བརྗོད་དུ་ཕྱོགས་མང་རིང་ལུགས་རྒྱུན་འཁྱོངས་བྱས་ནས་གོ་ལའི་བཅོས་སྐྱོང་འཐུས་སྒོ་ཚང་དུ་གཏོང་དགོས་ཞེས་པ་སྟེ་ཀྲུའུ་ཞི་ཞི་ཅིན་ཕིང་གི་འབོ་གསེར་རྒྱལ་ཁབ་བཟོ་ཚོང་གླེང་སྟེགས་ཀྱི་གལ་ཆེའི་གསུང་བཤད་ཐེངས་ལྔ་པ་ཞེས་པ་སྤེལ་བ' : '一些用户经常需要查看的，或横向对比的信息用户可以省去不断点击查看详情，再返回来查看的麻烦当然，这里的内容形式不只是表格，也可以是段落，信息组，甚至图表...一些用户经常需要查看的，或横向对比的信'
                                                        + '发生地方的发生的的丰富的是非官方的和规范'}
                                                </div></td> */}
                      <td><span className={item.flag ? 'active' : ''} onClick={() => {
                        this.toogle(index)
                      }}></span><span
                        onClick={(e) => {
                          this.down(e, index)
                        }}
                      >{item.flag2 ? '-' : "+"}</span>
                      {item.flag2?'':''}
                       <i  className={item.read?'iconfont icon-territory_shu2':'iconfont icon-territory_shu1'}></i>
                        <div className={item.flag2 ? 'down_td last_tr down_pop' : 'down_td last_tr'} >
                          {
                            this.props.warn ? <p>{item.content.replace(/<[^>]+>/g, "")}</p> : <p dangerouslySetInnerHTML={{ __html: item.content.replace(/<br \/>|<vrv-img\/>/g, '') }}></p>
                          }
                        </div>
                      </td>
                      <td>{item.idIndex}</td>
                      <td onClick={() => {
                        this.setState((prevState, props) => ({
                          number: index,
                          more: false
                        }))
                      }}>
                        <div className='p_title' style={{cursor:'pointer'}} 
                          // onClick={(e) => {this.down(e, index) }}
                        >
                          {
                            this.props.warn ? <div onClick={this.onGoDetail.bind(this,item.id, item.content, item.keyWord, item.info_id)} className='p_span'>{item.title.replace(/<[^>]+>/g, "")}</div>
                            : <div onClick={this.onGoDetail.bind(this,item.id, item.content, item.keyWord, item.info_id)} className='p_span' dangerouslySetInnerHTML={{ __html: item.title }}></div>
                          }
                        </div>
                      </td>
                      {/* <td>{this.props.baten ? 'ཁྲུན་ཁྲང་ཧྲེང་ཀུང་སིས་ཁྲིམས་འགལ་ལུགས་འགལ་ངང་ཁྱི་སྨྱོན་ནད་ཀྱི་འགོག་སྨན་ཐོ' : '从架构角度来看 Java 分布式日志如何收集'}</td> */}
                      <td style={{ whiteSpace: 'nowrap', overflow: 'hidden' }}>{item.webSite}</td>
                      {/* <td>{item.webSite || this.props.baten ? 'གལ་ངང་ཁྱི་སྨྱོན་ནད་ཀྱི' : '网易新闻App'}</td> */}
                      <td>{item.poTime}</td>
                      <td>{item.addTime}</td>
                      {
                        this.props.dataStudy && <td>{
                          item.judgeType == 0 ? '案件' : (item.judgeType == 1 ? "舆情" : '情报')
                        }</td> //信息巡查
                      }
                      <td onMouseLeave={() => {
                        this.leave(index)
                      }} onClick={() => {
                        this.setState((prevState, props) => ({
                          number: index,
                          more: false
                        }))
                      }}>
                        <div><span className='look' onClick={() => {
                          this.handle(item.id, item.content, item.keyWord, item.info_id)
                        }}>
                          <i className="iconfont icon-territory_look"></i>查看
                        {/* <Link to={`/journa/${JSON.stringify({ id: item.id })}`}>查看</Link> */}
                        </span>
                        
                        <span className='research' style={{ display: this.props.yanFlag||this.props.status ? 'none' : 'block' }}
                        >
                            {
                              !this.props.dataStudy? 
                              <b onClick={() => {
                                this.setState((prevState, props) => ({
                                  numflag: true,
                                }))
                                item.num2 = false;
                                item.num = !item.num
                              }}><i className="iconfont icon-territory_edit"></i>研判</b> : ''
                            }
                            
                            {
                              !this.state.numflag ? <div onMouseLeave={() => {
                                this.leave(index)
                              }}
                                className={index == this.state.number && (item.num || item.num2) ? 'research_son active_table' : 'research_son'}>
                                <p onClick={() => {
                                  this.pop(0)
                                }}><i className="iconfont icon-territory_add
                                "></i>加入样本</p><p className='active_poptable' style={{ display: this.props.dataStudy ? 'none' : 'block' }} onClick={() => {
                                  this.pop(8)
                                }}
                                ><i className="iconfont icon-territory_read
                                "></i>标记已阅</p></div> 
                                : <div onMouseLeave={() => {
                                  this.leave(index)
                                }}
                                  className={index == this.state.number && (item.num || item.num2) ? 'research_son active_table' : 'research_son'}>
                                  <p onClick={() => {
                                    this.pop(2)

                                  }}>案件</p><p className='active_poptable1' onClick={() => {
                                    this.pop(9)
                                  }}
                                  >舆情</p>
                                  <p
                                    onClick={() => {
                                      this.pop(10)
                                    }}
                                  >情报</p></div>
                            }</span>
                            <span className='addSamples' onClick={() => {
                                  this.pop(0)
                                }}><i className="iconfont icon-territory_add
                                "></i>加入样本</span>
                            <span className='active_poptable'  onClick={() => {
                                  this.pop(8)
                                }}
                                ><i className="iconfont icon-territory_read
                                "></i>标记已阅</span>
                            <span className='delete' onClick={() => {
                          this.pop(1)
                          this.setState((prevState, props) => ({
                            del: item.index + '|' + item.type + '|' + item.id,
                          }))
                        }}><i className="iconfont icon-territory_del"></i>删除</span>
                          <span onClick={() => {
                            this.setState((prevState, props) => ({
                              numflag: false
                            }))
                            item.num = false;
                            item.num2 = !item.num2
                          }}
                            
                          ></span>
                          {/* style={{ position: 'relative', top: '-5px', display: this.props.yanFlag ? 'none' : 'block' }} */}
                        </div>
                      </td>
                    </tr>
                  )
                })
              }

            </tbody>
          </table>
          <LocaleProvider locale={zh_CN}>
            <Pagination showQuickJumper showSizeChanger defaultCurrent={this.state.current} total={this.state.total}
              style={{ marginLeft: "35%" }} defaultPageSize={10} onChange={this.itemRender}
              onShowSizeChange={this.itemRender}
              current={this.state.current}
            />
          </LocaleProvider>
        </div>
      </div>
    )
  }
}

export default Table